<!-- 
伪元素选择器
    - 不需要html标签，直接利用CSS创建新标签，从而简化结构
    - CSS3是双冒号（为了区别伪类、伪元素）
    - CSS2是单冒号（仅用来支持IE8），用来兼容低版本浏览器的

        ::after         元素内部之前
        ::before        元素内部之后
        ::first-letter  首字母
        ::first-line    首行
        ::selection     用户选择的部分
        ::placeholder   placeholder属性

关于after、before的注意事项
    1）它们创建的元素属于行内元素
    2）在文档树中是找不到的，不是真正意义上的元素，称为伪元素
    3）必须要有content属性，否则无效
    4）是给父元素添加的，伪元素就是子元素
    5）跟元素选择器一样，伪元素选择器权重为：1
        div::after  1+1

结合字体图标使用
    第一步：项目中添加fonts字体文件、css文件
    第二步：页面link引入整个css文件
    第三步：font-family:'字体名'；自己查阅css文件
    第四步：content填入占位符（那个矩形框）或者标记（需要加斜杆\，因为是转义功能）
-->
<link rel="stylesheet" href="fonts/style.css" />

<style>
  div {
    position: relative;
    width: 300px;
    height: 35px;
    line-height: 35px;
    border: 1px solid red;
  }
  div::after {
    position: absolute;
    right: 10px;
    /* content: ""; */
    content: "\e909";
    font-family: "icomoon";
    color: #fa7343;
  }
</style>

<div>我是标签div的内容</div>
